<template>
  <div class="app-container">
    <el-card shadow="never">
      <!-- 搜索 -->
      <el-form ref="requestParameters" :model="requestParameters">
        <div class="filter-container">
          <el-row :gutter="20">
            <el-col :span="6">
              <el-form-item label="学科名称:" prop="subjectName">
                <el-input style="width: 180px;" @keypress.native.enter="handleFilter" v-model="requestParameters.subjectName" placeholder="请输入" class="filter-item"></el-input>
              </el-form-item>
            </el-col>
            <el-col :span="10">
              <el-form-item label="操作:">
                <el-button size="small" type="primary" @click="rest">清除</el-button>
                <el-button size="small" type="primary" @click="handleFilter">搜索</el-button>
              </el-form-item>
            </el-col>
            <el-button class="filter-item fr" size="small" style="margin-left: 10px;" type="primary" icon="el-icon-edit" @click="isShow=true">新增用户</el-button>
          </el-row>

        </div>
      </el-form>
      <!-- 数据记录 -->
      <el-alert :title='this.alertText' type="info" :closable='false' show-icon>
      </el-alert>
      <!-- 数据列表 -->
      <el-table :key="tableKey" :data="dataList" fit highlight-current-row style="width: 100%">
        <el-table-column align="center" label="序号" prop="id" type="index" :index="indexMethod">
          <!-- <template slot-scope="scope">
              <span>{{scope.id}}</span>
            </template> -->
        </el-table-column>
        <el-table-column align="center" label="学科名称" prop="subjectName">

        </el-table-column>
        <el-table-column align="center" label="创建者" prop="username">

        </el-table-column>
        <el-table-column align="center" label="创建日期">
          <template v-slot="{row}">
            {{diyTime(row.addDate)}}
          </template>
        </el-table-column>
        <el-table-column align="center" label="前台是否显示">
          <template v-slot='{row}'>{{row.isFrontDisplay==1?'是':'否'}}</template>
        </el-table-column>
        <el-table-column align="center" label="二级目录" prop="twoLevelDirectory">

        </el-table-column>
        <el-table-column align="center" label="标签" prop="tags">

        </el-table-column>
        <el-table-column align="center" label="题目数量" prop="totals">

        </el-table-column>
        <!-- 操作按钮 -->
        <el-table-column align="center" label="操作" width="280" class-name="small-padding fixed-width">
          <template v-slot='{row}'>
            <el-button type="text" size="mini" @click="gotolink">学科分类</el-button>
            <el-button type="text" size="mini" @click="gotoTag">学科标签</el-button>
            <el-button type="text" size="mini" @click="reviseList(row.id)">修改</el-button>
            <el-button size="mini" type="text" @click="removelist(row.id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
      <div class="pagination">
        <div class="pages">
          <el-pagination background @size-change="handleSizeChange" @current-change="handleCurrentChange" :current-page="Number(requestParameters.page)" :total="Number(total)" :page-size="Number(requestParameters.pagesize)" :page-sizes="[10,20,30, 50]" layout=" prev, pager, next,sizes, jumper"></el-pagination>
        </div>
      </div>
    </el-card>
    <subjects-add :isShow.sync='isShow' @onSuccess="onSuccess"></subjects-add>
    <subjects-edit :editShow.sync='editShow' :revise-id.sync='reviseId'></subjects-edit>
  </div>
  </div>
</template>

<script>
import { parseTime } from '../../utils/index'
import { list, remove } from '../../api/hmmm/subjects'
import SubjectsAdd from '../components/subjects-add.vue'
import SubjectsEdit from '../components/subjects-edit.vue'
export default {
  components: { SubjectsAdd, SubjectsEdit },
  name: 'Subjects',
  data () {
    return {
      reviseId: {},
      // 添加弹窗
      isShow: false,
      // 编辑弹窗
      editShow: false,
      tableKey: 0,
      // 数据列表
      dataList: [],
      // 数据记录
      total: null,
      // Loading加载
      listLoading: true,
      // 数据记录拼接
      alertText: '',
      requestParameters: {
        page: 1,
        pagesize: 10
      }
    }
  },
  methods: {
    // 打开编辑弹窗
    async reviseList (id) {
      // 打开弹窗
      this.editShow = true
      // 调用学科详情

      this.reviseId = id
    },
    // 搜索信息
    handleFilter () {
      this.requestParameters.page = 1
      this.asdList(this.requestParameters)
    },
    // 子组件调用asdList
    onSuccess () {
      this.asdList()
    },
    // 点击清除
    rest () {
      // 清除表单内容
      this.$refs.requestParameters.resetFields()
      // 刷新列表
      this.asdList()
    },
    // 点击学科分类
    gotolink () {
      this.$router.replace('/subjects/directorys')
    },
    // 点击学科标签
    gotoTag () {
      this.$router.replace('/subjects/tags')
    },
    // 删除
    async removelist (id) {
      const ret = await this.$confirm('此操作将永久删除该, 是否继续?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).catch(err => err)
      if (ret === 'cancel') return
      try {
        // 调用删除接口
        const del = await remove({ id: id })
        if (del.status === 200) {
          // 刷新列表
          this.asdList()
          // 提示删除成功
          this.$message.success('删除成功')
        }
      } catch (error) {
        this.$message.error('删除失败')
      }
    },
    // 学科列表
    async asdList () {
      // 调用学科列表
      const ret = await list(this.requestParameters)
      this.dataList = ret.data.items
      // 获取总条数
      this.total = ret.data.counts
      this.alertText = `共 ${this.total} 条记录`
    },
    // 格式化时间
    diyTime (addtime) {
      return parseTime(addtime)
    },
    // 每页显示信息条数
    handleSizeChange (val) {
      this.requestParameters.pagesize = val
      if (this.requestParameters.page === 1) {
        this.asdList(this.requestParameters)
      }
    },
    // 进入某一页
    handleCurrentChange (val) {
      this.requestParameters.page = val
      this.asdList()
    },
    // 自定义索引
    indexMethod (index) {
      return (this.requestParameters.page - 1) * this.requestParameters.pagesize + 1 + index
    }
  },
  created () {
    // 初始化列表
    this.asdList()
  },
  computed: {

  }
}
</script>
<style rel="stylesheet/scss" lang="scss" scoped>
.el-alert {
  margin: 10px 0px;
}
.pagination {
  margin-top: 10px;
}
.el-pagination {
  text-align: right;
}
.el-col-6 {
  width: 274px;
}
</style>
>>>>>>> 804c80c6a2c0f1b670438d96df151c82197c5839
